// /pages/booking/booking.js

const app = getApp(); // 获取全局App实例

Page({
  /**
   * 页面的初始数据
   */
  data: {
    equipmentCategoryList: [], // 左侧分类列表
    equipmentList: [],         // 右侧设备列表
    activeCategoryId: null,    // 当前选中的分类ID
    isLoading: true,           // 【新增】控制整体页面的加载状态，可用于骨架屏
    isListLoading: false,      // 【新增】控制右侧列表的加载状态，用于切换分类时
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 页面加载时，启动初始化流程
    this.initializePage();
  },

  /**
   * 页面初始化函数
   * 使用 async/await 整合了获取分类和获取初始设备的流程
   */
  async initializePage() {
    this.setData({ isLoading: true }); // 开始页面加载
    
    try {
      // 1. 使用全局 request 获取设备分类
      const categories = await app.request({
        url: '/api/app/devices/categories'
      });

      if (categories && categories.length > 0) {
        // 如果成功获取到分类
        const firstCategoryId = categories[0].id;
        this.setData({
          equipmentCategoryList: categories,
          activeCategoryId: firstCategoryId
        });
        
        // 2. 紧接着获取第一个分类下的设备列表
        //    我们把获取设备的逻辑也封装成一个独立的函数
        await this.fetchAndSetDevices(firstCategoryId);

      } else {
        // 如果分类为空，也更新页面状态
        this.setData({ equipmentCategoryList: [] });
      }
    } catch (err) {
      // app.request 内部已经处理了 Toast 提示，这里只需在控制台记录错误即可
      console.error("页面初始化失败", err);
    } finally {
      // 无论成功或失败，最后都结束页面加载状态
      this.setData({ isLoading: false });
    }
  },

  /**
   * 网络请求与数据处理函数：根据分类ID获取并设置设备列表
   * @param {number} categoryId - 设备分类的ID
   */
  async fetchAndSetDevices(categoryId) {
    this.setData({ isListLoading: true }); // 开始列表加载

    try {
      const devices = await app.request({
        url: `/api/app/devices/category/${categoryId}`
      });
      const baseUrl = app.globalData.config.baseUrl;
      // 将从后端获取的数据，处理成 WXML 中需要的格式
      const formattedList = devices.map(item => ({
        id: item.id,
        name: item.name,
        model: item.model || '未知型号',
        // 【优化】直接在 app.js 的 checkLoginStatus 中拼接 baseUrl，这里不再需要
        // 这里假设后端返回的 image_url 已经是完整的或者在其他地方统一处理
        imageUrl: item.image_url ? baseUrl + item.image_url : null,
        canBook: item.is_reservable,
        bookingType: item.remarks || "预约后由设备管理员操作"
      }));

      this.setData({
        equipmentList: formattedList
      });
      
    } catch (err) {
      console.error(`获取分类 ${categoryId} 的设备列表失败`, err);
      // 请求失败时，清空列表，避免显示旧数据
      this.setData({ equipmentList: [] });
    } finally {
      this.setData({ isListLoading: false }); // 结束列表加载
    }
  },

  /**
   * 事件处理：切换左侧分类
   */
  onSwitchCategory(e) {
    const newCategoryId = e.currentTarget.dataset.id;

    // 如果点击的是当前已选中的分类，或列表正在加载中，则不执行任何操作
    if (newCategoryId === this.data.activeCategoryId || this.data.isListLoading) {
      return;
    }

    // 更新选中的分类ID，并调用封装好的函数获取新列表
    this.setData({
      activeCategoryId: newCategoryId,
    });
    this.fetchAndSetDevices(newCategoryId);
  },

  /**
   * 事件处理：点击搜索栏，跳转到搜索页
   */
  onGoToSearch() {
    wx.navigateTo({
      url: '/pages/search/search'
    });
  },

  /**
   * 事件处理：点击"预约"按钮
   * 此功能需要登录，我们使用 ensureLoggedIn 守卫
   */
  async onGoToEquipmentDetail(e) {
    // 1. 使用登录守卫确保用户已登录
    const isLoggedIn = await app.ensureLoggedIn();
    if (!isLoggedIn) return; // 如果未登录，守卫已处理跳转，函数中断

    // --- 只有登录用户才能执行到这里 ---
    const selectedItem = e.currentTarget.dataset.item;
    console.log("准备预约的设备:selectedItem ==> ",selectedItem);

    // 2. 跳转到设备详情页
    wx.navigateTo({
      url: `/pages/device-detail/device-detail?id=${selectedItem.id}`
    });
  }
});